<template>
  <div>
    <Table
      :table="table"
      :tableColumns="tableColumns"
      :loadTableList="loadTableList"
      :changePageSize="changePageSize"
      :changePage="changePage"
      :deleteMultipleSelectionUrl="$urls.API_URL_BACKSTAGE_SCHOOLTEACHINGTASK_MANAGE"
      :showDeleteButton="false"
      @addRow="addRow"
      @editRow="editRow"
    >
<!--      所属课程-->
      <template #course="scope">
       <span v-if="scope.row.schoolCourse != null&&scope.row.schoolCourse">
          {{ scope.row.schoolCourse.name }}
        </span>
      </template>
<!--      所属学期-->
      <template #schoolTerm="scope">
        <span v-if="scope.row.schoolTerm !== null && scope.row.schoolTerm">
          {{scope.row.schoolTerm.name}}
        </span>
      </template>
      <template #table_operator_right="scope">
        <el-button type="primary"  size="small" icon="Edit" plain @click="goClassMessage(scope.row.id)">进入</el-button>
      </template>
    </Table>
  </div>
</template>

<script lang="ts" setup>
// 导入表格组件
import Table from '@/components/base/table/Table.vue';

// 接收父组件传递过来的的值
import { defineProps, getCurrentInstance, ref } from 'vue';
import { TableColumn, TableData } from '@/types/interface/base_interface';
import { TeachingClass } from '@/types/interface/school_interface';
import { useRouter } from 'vue-router';
// 导入element插件对象
// import { ElMessage } from 'element-plus';
// 接受父组件的值
interface Props {// 需要在父组件引入自定义的@/api/uem/useTableList.ts组件，然后将其中的部分属性传过来
  table: TableData, // 偷懒写法
  loadTableList:()=>void, // 重新加载表格
  changePageSize:()=>void, // 当每页数据显示数发生变化时触发的一个函数
  changePage:()=>void, // 当页面发生变化时触发的一个函数
}
const props = defineProps<Props>();
const { proxy } = getCurrentInstance();
const router = useRouter();
// 设置表格的列
// 定义表格所有的列字段信息
const tableColumns = ref<TableColumn[]>([
  {
    label: '教学班级',
    prop: 'className',
    width: 200,
  },
  {
    label: '所属课程',
    prop: 'course',
    width: 300,
    type: 'custom',
  },
  {
    label: '所属学期',
    prop: 'schoolTerm', // 在auth_interface SchoolTeachingTaskTable里
    width: 200,
    type: 'custom', // 自定义的意思
  },
  {
    label: '创建时间',
    prop: 'createTime',
  },
  {
    label: '修改时间',
    prop: 'updateTime ',
  },
]);

// 点击添加按钮，交由父组件处理
const addRow = (id:number) => {
  proxy.$emit('addRow', id);
};
// 编辑操作
const editRow = (row:TeachingClass):void => {
  proxy.$emit('editRow', row);
};
// 添加学生操作
const addStudents = (id:number) => {
  proxy.$emit('addStudents', id);
};
// 跳转到课程信息页
const goClassMessage = (id:any) => {
  router.push({
    name: 'classmessage',
  });
  sessionStorage.setItem('teachingTaskId', id);
};
</script>
<style scoped>
</style>
